<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2018-06-06
  Time: 17:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>客户管理</title>
    <%@include file="../statics/AllJavaScript.jsp"%>
    <script type="text/javascript" src="${pageContext.request.contextPath}/statics/table/rawgit-bootstrap-editable.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/statics/table/combodate.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/statics/table/bootstrap-table-editable.min.js"></script>
</head>
<body>
<div class="input-group" style="margin: 0 50px; width: 200px;">
    姓名：<input id="pName" name="pName" type="text" lang="zh-CN" class="form-control" placeholder="搜索内容"/>
    <div class="dropdown"  style="display: inline-block">
        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1"
                data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
            <span class="selectInfo1">请选择</span>
            <span class="caret"></span>
        </button>
        <ul class="dropdown-menu" id="selectItem" aria-labelledby="dropdownMenu1">
            <li><a href="JavaScript:" onclick="seleInfo(1)">男</a></li>
            <li><a href="javaScript:" onclick="seleInfo(2)">女</a></li>
        </ul>
    </div>
    <button onclick="search()" type="button" class="btn btn-default">查询</button>
</div>
<input type="text" id="Sex" style="display: none;">
<table id="table"></table>
</body>
<script type="text/javascript">
    function seleInfo(sexid) {
        var Sex= $("#Sex");
        switch (sexid){
            case 1:
                $(".selectInfo1").html("男");
                Sex.val("男");
                return ;
            case 2:
                $(".selectInfo1").html("女");
                Sex.val("女");
                return ;
        }
    }
    var pid=0;
    $(function () {
       $("#table").bootstrapTable({
           url:"${pageContext.request.contextPath}/customer/queryAllInfo",
           editable:true,//开启编辑模式
           clickToSelect: true,
           disabled: false,
           cache: false,
           showToggle:true, //显示切换按钮来切换表/卡片视图。
           showPaginationSwitch:true, //显示分页切换按钮
           pagination: true,
           pageList: [10,25,50,100],
           sidePagination: 'server',
           pageSize:10,
           pageNumber:1,
           uniqueId: 'pid', //将index列设为唯一索引
           striped: true,
           showRefresh: true,
           minimumCountColumns: 2,
           smartDisplay:true,
           contentType: "application/x-www-form-urlencoded",
           queryParamsType:'',
           method:"post",
           height:750,
           onClickRow:function(row,$element){
               if(pid!=0){
                   pid=0;
               }
               pid=row.pId;
           },
           queryParams:function(params){
               var  temp={
                   pageSize:params.pageSize,
                   pageNumber:params.pageNumber,
                   name:$("#pName").val(),
                   sex:$("#Sex").val()
               }
               return temp;
           },
           columns:[{
               title:"用户编号",
               field:"pId",
             editable:false
           },{
               title:"姓名",
               field:"pName",
               align:"center",
               editable: {
                   type: 'text',
                   title: '用户名',
                   validate: function (v) {
                       if (!v) return '用户名不能为空';
                       UpdateUser(v,"pName",pid);
                   }
               }
           },{
               title:"身份证号",
               field:"pCards",
               align:"center",
               editable: {
                   type:'text',
                   title:'身份证号',
                   validate: function (v) {
                       if (!v) return '身份证号不能为空';
                       UpdateUser(v,"pCards",pid);
                   }
               }
           },{
                title:"性别",
                field:"pSex",
               align:"center",
               editable:{
                   type:'select',//下拉框
               /*  url:'./index.php?r=dictionary/dictionaryInfo&type='+"run",*/
                   /*data:[{id:1,text:'hello'},{id:2,text:'hi'}],*/
                   source:[{value:"男",text:"男"},{value:"女",text:"女"}],
                  valueField:'id',
                   textField:'text',
                   editable : false,
                   validate(v){
                       UpdateUser(v,"pSex",pid)
                   }
              /*  onSelect:function(val,rec){
                       console.log(val,rec);
                   }*/
               }},{
               title:"邮箱",
               field:"pEmal",
               align:"center",
               editable: {
                   type: 'text',
                   title: '邮箱',
                   validate: function (v) {
                       if (!v) return '邮箱不能为空';
                       UpdateUser(v,"pEmal",pid)
                   }
               }
           },{
               title:"出生日期",
               field:"pBirthDate",
               align:"center",
               editable:{
                   title:"出生日期",
                   type:"date",
                   placement:"bottom",
                   format:"yyyy-mm-dd",
                   validate(v){
                       var  resDate = v.getFullYear() + '-' + (v.getMonth() + 1) + '-' + v.getDate() + ' ' + v.getHours() + ':' + v.getMinutes() + ':' + v.getSeconds();
                       UpdateUser(resDate,"pBirthDate",pid);
                   }
               }
           },{
               title:"电话",
               field:"pPhone",
               align:"center",
               editable:{
                   title:"电话",
                   type:"text",
                   placement:"bottom",
                   validate(v){
                       if(!v) return "电话不能为空";
                       UpdateUser(v,"pPhone",pid);
                   }
               }
           },{
               title:"操作",
               formatter(value,row,index){
                   return "<button class='btn btn-default btn-xs glyphicon glyphicon-remove' onclick='del("+row.pid+")'></button>";
               }
           }]
       })
    });

    /**
     * 删除
     * @param id
     */
    function del(id) {
        swal({
            title: "您确定要删除这条信息吗",
            text: "删除后将无法恢复，请谨慎操作！",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "删除",
            closeOnConfirm: true
        }, function () {
            $.ajax({
                "url":"${pageContext.request.contextPath}/customer/del",
                "data":{"pid":id},
                "type":"post",
                "success":function (data) {
                    if(data==true){
                        $("#table").bootstrapTable("refresh");
                    }
                },
                erro:function (XMLHttpRequest, textStatus, errorThrown) {
                    alert("删除失败");
                    console.log("状态码:"+XMLHttpRequest+"错误信息:"+textStatus)
                }
            })
        })
    }



    function search() {
        var opts = $("#table").bootstrapTable('getOptions');
        var Sex = $("#Sex").val();
        var pName = $("#pName").val();
        $.ajax({
            "url": "${pageContext.request.contextPath}/customer/queryAllInfo",
            "type": "post",
            "data": {
                "name": pName,
                "sex": Sex,
                "pageNumber": opts.pageNumber,
                "pageSize": opts.pageSize
            },
            "dataType": "json",
            "success": function (data) {
                $("#table").bootstrapTable('load', data);
            }
        })
    }
    function UpdateUser(Info,Type,id) {
        var data={};
        data[Type]=Info;
        data["pId"]=id;
        $.ajax({
            url:"${pageContext.request.contextPath}/customer/Update",
            type:"post",
            data:data,
            datatype:"json",
            "success":function (data) {
                if (data == true){
                    alert("成功");
                }
            },
            "erro":function (erro) {
              alert(erro.toString());
            }
        })
    }

</script>
</html>
